jQuery.noConflict()
var ddimagepanner={magnifyicons:['http://3.bp.blogspot.com/-5txsCX6GVZc/UBlCDcd7n7I/AAAAAAAABtU/MDDCt6U1uV0/s1600/zoomIn.png','http://4.bp.blogspot.com/-yos1IIQHgGM/UBlCj9O7_OI/AAAAAAAABts/exZixOQS_S8/s1600/zoom+Out.png',16,16],maxzoom:4,init:function($,$img,options){var s=options
s.imagesize=[$img.width(),$img.height()]
s.oimagesize=[$img.width(),$img.height()]
s.pos=(s.pos=="center")?[-(s.imagesize[0]/2-s.wrappersize[0]/2),-(s.imagesize[1]/2-s.wrappersize[1]/2)]:[0,0]
s.pos=[Math.floor(s.pos[0]),Math.floor(s.pos[1])]
$img.css({position:'absolute',left:s.pos[0],top:s.pos[1]})
if(s.canzoom=="yes"){s.dragcheck={h:(s.wrappersize[0]>s.imagesize[0])?false:true,v:(s.wrappersize[1]>s.imagesize[1])?false:true}
s.$statusdiv=$('<div style="position:absolute;color:white;background:#353535;padding:2px 10px;font-size:12px;visibility:hidden">1x Magnify</div>').appendTo(s.$pancontainer)
s.$statusdiv.css({left:0,top:s.wrappersize[1]-s.$statusdiv.outerHeight(),display:'none',visibility:'visible'})
this.zoomfunct($,$img,s)}
this.dragimage($,$img,s)},dragimage:function($,$img,s){$img.mousedown(function(e){s.pos=[parseInt($img.css('left')),parseInt($img.css('top'))]
var xypos=[e.clientX,e.clientY]
$img.bind('mousemove.dragstart',function(e){var pos=s.pos,imagesize=s.imagesize,wrappersize=s.wrappersize
var dx=e.clientX-xypos[0]
var dy=e.clientY-xypos[1]
s.dragcheck={h:(wrappersize[0]>imagesize[0])?false:true,v:(wrappersize[1]>imagesize[1])?false:true}
if(s.dragcheck.h==true)
var newx=(dx>0)?Math.min(0,pos[0]+dx):Math.max(-imagesize[0]+wrappersize[0],pos[0]+dx)
if(s.dragcheck.v==true)
var newy=(dy>0)?Math.min(0,s.pos[1]+dy):Math.max(-imagesize[1]+wrappersize[1],pos[1]+dy)
$img.css({left:(typeof newx!="undefined")?newx:pos[0],top:(typeof newy!="undefined")?newy:pos[1]})
return false})
return false})
$(document).bind('mouseup',function(e){$img.unbind('mousemove.dragstart')})},zoomfunct:function($,$img,s){var magnifyicons=this.magnifyicons
var $zoomimages=$('<img src="'+magnifyicons[0]+'" /><img src="'+magnifyicons[1]+'" />').css({width:magnifyicons[2],height:magnifyicons[3],cursor:'pointer',zIndex:1000,position:'absolute',top:s.wrappersize[1]-magnifyicons[3]-1,left:s.wrappersize[0]-magnifyicons[2]-3,opacity:0.7}).attr("title","Zoom Out").appendTo(s.$pancontainer)
$zoomimages.eq(0).css({left:parseInt($zoomimages.eq(0).css('left'))-magnifyicons[2]-3,opacity:1}).attr("title","Zoom In")
$zoomimages.click(function(e){var $zimg=$(this)
var curzoom=s.curzoom
var zoomtype=($zimg.attr("title").indexOf("In")!=-1)?"in":"out"
if(zoomtype=="in"&&s.curzoom==ddimagepanner.maxzoom||zoomtype=="out"&&s.curzoom==1)
return
var basepos=[s.pos[0]/curzoom,s.pos[1]/curzoom]
var newzoom=(zoomtype=="out")?Math.max(1,curzoom-1):Math.min(ddimagepanner.maxzoom,curzoom+1)
$zoomimages.css("opacity",1)
if(newzoom==1)
$zoomimages.eq(1).css("opacity",0.7)
else if(newzoom==ddimagepanner.maxzoom)
$zoomimages.eq(0).css("opacity",0.7)
clearTimeout(s.statustimer)
s.$statusdiv.html(newzoom+"x Magnify").show()
var nd=[s.oimagesize[0]*newzoom,s.oimagesize[1]*newzoom]
var newpos=[basepos[0]*newzoom,basepos[1]*newzoom]
newpos=[(zoomtype=="in"&&s.wrappersize[0]>s.imagesize[0]||zoomtype=="out"&&s.wrappersize[0]>nd[0])?s.wrappersize[0]/2-nd[0]/2:Math.max(-nd[0]+s.wrappersize[0],newpos[0]),(zoomtype=="in"&&s.wrappersize[1]>s.imagesize[1]||zoomtype=="out"&&s.wrappersize[1]>nd[1])?s.wrappersize[1]/2-nd[1]/2:Math.max(-nd[1]+s.wrappersize[1],newpos[1])]
$img.animate({width:nd[0],height:nd[1],left:newpos[0],top:newpos[1]},function(){s.statustimer=setTimeout(function(){s.$statusdiv.hide()},500)})
s.imagesize=nd
s.curzoom=newzoom
s.pos=[newpos[0],newpos[1]]})}}
jQuery.fn.imgmover=function(options){var $=jQuery
return this.each(function(){if(this.tagName!="IMG")
return true
var $imgref=$(this)
if(parseInt(this.style.width)>0&&parseInt(this.style.height)>0)
ddimagepanner.init($,$imgref,options)
else if(this.complete){ddimagepanner.init($,$imgref,options)}
else{$imgref.bind('load',function(){ddimagepanner.init($,$imgref,options)})}})}
jQuery(document).ready(function($){var $pancontainer=$('div.pancontainer')
$pancontainer.each(function(){var $this=$(this).css({position:'relative',overflow:'hidden',cursor:'move'})
var $img=$this.find('img:eq(0)')
var options={$pancontainer:$this,pos:$this.attr('data-orient'),curzoom:1,canzoom:$this.attr('data-canzoom'),wrappersize:[$this.width(),$this.height()]}
$img.imgmover(options)})})